<template>
    <div class="bbs">
      
      <el-table :data="tableData" border style="width: 100%" align='center'>
            <el-table-column 
                :prop="title.info.prop"
                :label="title.info.label"
                :sortable="title.info.sortable"
                :align="title.style.align"
                :width="title.style.width">
            </el-table-column>
            <el-table-column 
                :prop="group.info.prop"
                :label="group.info.label"
                :sortable="group.info.sortable"
                :align="group.style.align"
                :formatter="formatterGroup"
                :width="group.style.width"
                :filters="group.filter.list"
                :filter-method="filterGroup"
                :filter-multiple="group.filter.multiple">
            </el-table-column>
            <el-table-column 
                :prop="status.info.prop"
                :label="status.info.label"
                :sortable="status.info.sortable"
                :align="status.style.align"
                :formatter="formatterStatus"
                :width="status.style.width"
                :filters="status.filter.list"
                :filter-method="filterStatus"
                :filter-multiple="status.filter.multiple">
            </el-table-column> 
            <el-table-column 
                :prop="content.info.prop"
                :label="content.info.label"
                :sortable="content.info.sortable"
                :align="content.style.align"
                :formatter="formatterContent"
                :width="content.style.width">
            </el-table-column>
            <el-table-column 
                :prop="ctime.info.prop"
                :label="ctime.info.label"
                :sortable="ctime.info.sortable"
                :align="ctime.style.align"
                :formatter="formatterTime"
                :width="ctime.style.width">
            </el-table-column>
            <el-table-column 
                :prop="like_count.info.prop"
                :label="like_count.info.label"
                :sortable="like_count.info.sortable"
                :align="like_count.style.align"
                :width="like_count.style.width">
            </el-table-column>
            <el-table-column 
                :prop="comment_count.info.prop"
                :label="comment_count.info.label"
                :sortable="comment_count.info.sortable"
                :align="comment_count.style.align"
                :width="comment_count.style.width">
            </el-table-column>
            <el-table-column 
                :prop="read_count.info.prop"
                :label="read_count.info.label"
                :sortable="read_count.info.sortable"
                :align="read_count.style.align"
                :width="read_count.style.width">
            </el-table-column>
            
             <el-table-column label="操作" align="center" v-if="checkLevel()">
                <template scope='scope'>
                        <el-button type="info"  size="mini" @click='onTop(scope.row)'>置顶</el-button>
                        <el-button type="info"  size="mini" @click='onAddDigest(scope.row)'>加精</el-button>
                        <el-button type="info"  size="mini" @click='onRecommended(scope.row)'>推荐</el-button>
                        <el-button type="info"  size="mini" @click='onCancel(scope.row)'>取消状态</el-button>
                        <el-button type="info"  size="mini" @click='onPreview(scope.row)'>查看详情</el-button>
                        <el-button type="danger"  size="mini" @click='onDelete(scope.row,scope.$index)'>删除</el-button>
                </template>
            </el-table-column>  
        </el-table>

         <div class="block">
            <el-pagination
            style="margin-top:10px;"
            align="center"
            @current-change="handleCurrentChange"
            :current-page="currentPage"
            :page-size="tableCount"
            :layout="layout"
            :total="tableTotal">
            </el-pagination>
        </div>

        <el-dialog title="论坛详情" v-model="bbsDetailVisible">
             <div v-if="previewData">
                <div v-if="previewData.bbs">
                <p>帖子名称:<span>{{previewData.bbs.title}}</span></p>
                <p>发布时间:<span>{{formatterTime(previewData.bbs)}}</span></p>
                <div v-if="previewData.user">
                    <p>楼主昵称:<span>{{previewData.user.nickName}}</span></p>
                    <p v-if="previewData.user.icon">楼主头像:<img :src="previewData.user.icon" width="50px;"></span></p>
                </div>
                <p>阅读数:<span>{{previewData.bbs.read_count}}</span></p>
                <p>评论数:<span>{{previewData.bbs.comment_count}}</span></p>
                <p>点赞数:<span>{{previewData.bbs.like_count}}</span></p>
                <p>状态:<span>{{formatterStatus(previewData.bbs)}}</span></p>
                <p>模板:<span>{{formatterGroup(previewData.bbs)}}</span></p>
                <p>帖子内容:<span>{{previewData.bbs.content}}</span></p>
                <p v-if="previewData.bbs.images">
                    <img v-for="img in previewData.bbs.images" :src="img" width="200px;">
                </p>

                </div>
              </div>
        </el-dialog>

   

     

    </div>
</template>

<script>
import BbsJs from './Bbs.js';
module.exports = BbsJs;
</script>

<style>
</style>
